<template>
  <FormItem v-bind="formItemProps" :name="dataIndex" :label="title">
    <slot>
      <component
        :is="render?.(model!) || widgets[`__${valueType}`]"
        v-bind="_fieldProps"
        v-model:value="model[dataIndex]"
        v-model:checked="model[dataIndex]"
      />
    </slot>
  </FormItem>
</template>

<script setup lang="ts">
import { FormItem } from 'ant-design-vue';
import { useInjectFormInstance } from './formInstance';
import { BoFormProps, Column, ColumnChildren, RecordRow } from './interface';
import * as widgets from './widgets';
import { computed } from 'vue';

type Props = Omit<Column, 'formItemRender'> & {
  model: RecordRow;
};
const {
  valueType,
  fieldProps,
  formItemProps,
  dataIndex,
  title,
  render,
  model,
} = defineProps<Props>();

const _fieldProps = computed<Props['fieldProps']>(() => {
  return typeof fieldProps === 'function' ? fieldProps(model) : fieldProps;
});
</script>
